<!--
 * @Author: 刘东升
 * @Date: 2021-07-14 17:24:44
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2021-12-01 12:01:51
 * @Descripttion:
 * @version:
-->
<template>
  <el-card shadow="never" class="aui-card--fill">
    <div class="mod-demo__news">
      <div class="table_tool_box">
        <el-form :inline="true" :model="dataForm" class="demo-form-inline" @keyup.enter.native="getDataList()">
          <el-form-item label="任务名称">
            <el-input v-model="dataForm.name" placeholder="任务名称" clearable />
          </el-form-item>
          <el-form-item>
            <el-button type="primary" plain @click="addOrUpdateHandle()">新增</el-button>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" plain @click="getDataList">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <div class="table_box">
        <el-table :data="dataList" border style="width: 100%; margin-bottom: 20px" @sort-change="commonSortChangeHandle">
          <el-table-column align="center" label="任务名称" prop="taskName" />
          <el-table-column align="center" label="任务类型" prop="taskType">
            <template slot-scope="scope">
              <span>{{ scope.row.taskType == 1 ? "多学科联合仿真及优化业务" : "基于ANSYS的DDR自动化仿真" }}</span>
            </template>
          </el-table-column>
          <el-table-column align="center" label="变形优化指标" prop="shapeIndex" sortable />
          <el-table-column align="center" label="散热优化指标" prop="heatIndex" sortable />
          <el-table-column align="center" label="任务状态" prop="state" width="240" :show-overflow-tooltip="true">
            <template slot-scope="scope">
              <el-tag :type="filterTagType(scope.row.state)" effect="plain">{{ filterState(scope.row.state) }}</el-tag>
            </template>
          </el-table-column>
          <el-table-column align="center" label="操作">
            <template slot-scope="scope">
              <el-button type="text" @click="deilMsg(scope.row)">任务记录</el-button>
              <el-button type="text" style="color: green" @click="hanleState(scope.row.id, scope.row.state)">更新状态</el-button>
              <el-button type="text" style="color: red" class="deleteBtn" @click="deleteHandle(scope.row.id)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total" layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle" @current-change="pageCurrentChangeHandle" />
    </div>
    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList" />
    <state v-if="stateVisible" ref="state" @refreshDataList="getDataList" />
  </el-card>
</template>

<script>
import PageModule from '@/mixins/page-module'
import AddOrUpdateModule from '@/mixins/add-or-update-module'
import AddOrUpdate from './edit.vue'
import State from './state.vue'

import Cookies from 'js-cookie'

import { businessTaskExportReport } from '@/api/businessTask/api'

export default {
  components: {
    AddOrUpdate,
    State
  },
  mixins: [PageModule, AddOrUpdateModule],
  data() {
    return {
      dataList: [],
      dataForm: {
        id: ``,
        name: ''
      },
      stateVisible: false,
      dataListURL: '/businessTask/page',
      deleteURL: `/businessTask`,
      canUpdateDis: false
    }
  },
  created() {
  },
  methods: {
    hanleExport(id) {
      window.open(`http://211.139.107.122:8882/businessTask/exportReport/${id}` + '?token=' + Cookies.get('token'))
      // businessTaskExportReport(id).then(res => {
      //     if (res.code == 200) {
      //         this.$message.success(`操作成功！`)

      //     } else {
      //         this.$message.error(res.message)
      //     }
      // })
    },
    hanleState(id, state) {
      this.stateVisible = true
      this.$nextTick(() => {
        this.$refs.state.dataForm.id = id
        // this.$refs.state.dataForm.state = state
        this.$refs.state.init()
      })
    },
    deilMsg(obj) {
      const { id, result, taskType } = obj
      this.$router.push({ path: '/task/childTask', query: { taskId: id, taskType: taskType }})
      this.$store.dispatch('task/updateTaskResult', result )
    },
    filterState(state) {
      switch (state) {
        case 1:
          return '执行中'
        case 2:
          return '已执行'
        case 3:
          return '已审核'
        case 4:
          return '已完成'
        default:
          return
      }
    },
    filterTagType(state) {
      switch (state) {
        case 1:
          return
        case 2:
          return 'success'
        case 3:
          return 'success'
        case 4:
          return 'danger'
        default:
          return
      }
    }
  }
}
</script>
